<template>
 <ynet-content id="certificateChange" :headerInformation="true" :headerMenu="true">
    <div class="main-container" >
		  <ynet-breadcrumb></ynet-breadcrumb>
	  </div>
     <div class="main-container functionalArea" v-if="first">
       <el-form ref="queryForm" :model="queryForm" class="formEmbedTable" :rules="rules">
            <table>
                <caption>Enquiry</caption>
                <tr>
                    <td>Report No：</td>
                    <td colspan="3">
                       <el-form-item prop="repNo">
                          <el-input v-model="queryForm.repNo"></el-input>
                      </el-form-item>
                    </td>
                </tr>
                <tr>
                    <td>Date：</td>
                    <td colspan="3">
                        <el-form-item  prop="startDateObj">
                        <el-date-picker v-model="queryForm.startDateObj" @change="queryForm.startDate=$tools.utils.formatDate(queryForm.startDateObj)" type="date" placeholder="startTime"></el-date-picker>
                        </el-form-item>
                        <span> To </span>
                        <el-form-item  prop="endDateObj">
                        <el-date-picker v-model="queryForm.endDateObj" @change="queryForm.endDate=$tools.utils.formatDate(queryForm.endDateObj)" type="date" placeholder="endTime"></el-date-picker>
                        </el-form-item>               
                    </td>
                </tr>	
            </table>
            <div class="btnArea mt20 tac">
                <el-button type="primary" @click="queryInfo">Search</el-button>
                <!--
                <el-button @click="resetForm('queryForm')">重置</el-button>
                -->
            </div>
		</el-form>
        <div class="fourForm tableForm mt20 printArea tableData">
            <el-table :data="tableData" stripe>
                <el-table-column label="Report No" prop="repNo" > </el-table-column>
                <el-table-column label="Report Name" prop="repName"></el-table-column>
                <el-table-column label="Create Time" prop="createTime">
                    <template scope="scope">
                        {{$tools.utils.formatDate(scope.row.createTime,{"symbol":"YYYY-MM-DD HH:mm"})}}
                    </template>
                </el-table-column>
                <el-table-column label="Status" prop="status">
                    <template scope="scope">
                        <el-button type="text" class="cBlue" @click="downPDF(scope.row)">DownLoad</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div class="pagination tar mt20">
            <el-pagination  @current-change="handleCurrentChange" :current-page="Number(queryForm.currentPage)" :page-size="Number(queryForm.turnPageShowNum)" layout="total, prev, pager, next, jumper" :total="Number(turnPageTotalNum)">
            </el-pagination>
        </div>
        <!--
         <div class="btnArea mt20 tac">
            <el-button type="primary" @click="printCstInfo">打印清单</el-button>
            <el-button type="primary" @click="downFile()">下载</el-button>
        </div> 
        -->
    </div>
  </ynet-content> 

</template>
<script>
        export default {
        name:'operatorFreezing',
        components: {
        },
        data() {
            return {
                first:true,
                second:false,
                dialogVisible:false,
                turnPageTotalNum:'',
                queryForm:{ 
                    repNo:'',
                    currentPage:'1', 
                    turnPageShowNum:'10',
                    startDateObj:'',
                    endDateObj:'',
                    startTime:'',
                    endTime:'',
                    bsnCode:'IM0105',
                },
                rules:{
                    // flowNo:[
                    //     {trigger:'blur',message:'不能为空',required:true},
                    //     {trigger:'blur',validator:this.$tools.validator.isEngNum},
                    // ],
                    startDateObj: [
                        {trigger: 'blur', validator:this.$tools.validator.compareDate,compareList:['startDateObj','endDateObj'],vm:this,formName:'queryForm'}
                    ],
                    endDateObj: [
                        {trigger: 'blur', validator:this.$tools.validator.compareDate,compareList:['startDateObj','endDateObj'],vm:this,formName:'queryForm'}
                    ],
                },
                tableData:[],//查询到的流水集合
                downForm:{
                    bsnCode:'IM0801',reportList:[],
                },
            }
        },

    methods:{
        handleCurrentChange(val) {//分页方法
            this.queryForm.currentPage=val;
            this.queryReport()
        },
        printCstInfo() {
            this.$tools.print();
        },
        queryInfo(){
            let _this=this
            _this.queryForm.currentPage='1';
            _this.queryForm.turnPageShowNum='10';
            _this.queryForm.startTime=this.$tools.utils.formatDate(_this.queryForm.startDateObj,{'config':'toDay'})
            _this.queryForm.endTime=this.$tools.utils.formatDate(_this.queryForm.endDateObj,{'config':'toDay'})
            _this.queryReport()
        },
        queryReport(){
            let _this=this
            _this.$tools.request(_this,"IM0801QueryAction.do",_this.queryForm).then(data => {
                console.log("data:"+JSON.stringify(data))
                this.tableData=data.body.reportList
                this.turnPageTotalNum=data.body.turnPageTotalNum
            })
        },
        resetForm(queryForm) {
            this.$refs[queryForm].resetFields();
        },
        downPDF(val){
            console.log("val:"+JSON.stringify(val))
            // let url="/api/IM0801DownAction.do";
            // let form = $("<form></form>").attr("action", url).attr("method", "post")
            // form.append($("<input></input>").attr("type", "hidden").attr("name", "bsnCode").attr("value", "IM0601"))
            // form.append($("<input></input>").attr("type", "hidden").attr("name", "versionNo").attr("value", "1.0"))
            // form.append($("<input></input>").attr("type", "hidden").attr("name", "iCIFID").attr("value", this.$tools.storage.get("user",'save').iCIFID))
            //form.appendTo("body").submit().remove()
            this.downForm.reportList=[];
            this.downForm.reportList.push(val)
            console.log("downForm:"+JSON.stringify(this.downForm))
            this.$tools.request(this,"IM0801DownAction.do",this.downForm).then(data=>{
                 console.log(data)
            })
        },
    }

}
</script>
<style> 
.money .el-input{width:50%;}
.money .el-form-item{width:80%;}
.money .el-form-item__label{padding: 11px 12px 11px 133px;}
</style>